<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>tl-ops-manage</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <script src="layui/layui.js" v="layui" e="layui"></script>
    <link rel="stylesheet" type="text/css" href="layui/css/layui.css" />
    <link href="https://qnproxy.iamtsm.cn/44826979.png" rel="shortcut icon" type="image/x-icon">
</head>

<style>
    .layui-nav{
        text-align: right;
        background-color: black;
    }
    .tlops-logo{
        width: 128px;
        height: 64px;
        -webkit-user-drag: none;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1000;
    }
    .tlops-manage{
        -webkit-user-drag: none;
        width: 100%;
        height: auto;
    }
    .tlops-github-logo{
        width: 24px;
        height: 24px;
        position: absolute;
        top: 16px;
        margin-left: -30px;
    }
    .tlops-intro-content{
        padding: 120px 12px 120px 12px;
        background-color: #2b2e3b;
        text-align: center;
    }
    .tlops-intro-main{
        color: #fcfcfc;
        font-size: 36px;
        font-weight: 300;
    }
    .tlops-intro-tag{
        margin-top: 30px;
        color: #fcfcfc;
        font-size: 25px;
        font-weight: 300;
        width: 70%;
        margin-left: 15%;
    }
    .tlops-feat-content{
        padding: 20px 12px 20px 12px;
        text-align: center;
    }
    .tlops-foot-content{
        position: relative;
        padding-top: 20px;
        padding-bottom: 20px;
        margin-top: 20px;
        right: 30px;
        line-height: 25px;
        border-top: 1px solid #e8e8e8;
        font-size: 14px;
        font-weight: 800;
        color: #5c5555;
        text-align: right;
    }
    .layui-panel{
        padding: 15px;
    }
    .layui-card-header{
        color: green;
        font-weight: 700;
        font-size: 18px;
    }
    .layui-card-body{
        font-weight: 700;
    }
    .tlops-feat-content-comment{
        color:  #8492a6;
        text-align: left;
        font-size: 16px;
    }
    .tlops-feat-content-data{
        color:  #2eca8b;
        text-align: left;
        font-size: 20px;
    }
    .tlops-feat-content-all{
        padding: 20px;
        word-break: break-all;
    }
    .tlops-feat-content-all div{
        margin-top: 20px;
    }
    .tlops-quick-start{
        padding: 50px;
        margin: 10px;
        border-radius: 12px;
        background: #2b2e3b;
        font-weight: 700;
    }
    .tlops-quick-start-line{
        border-bottom: 1px solid #623c3c;
        margin-top: 50px;
        margin-bottom: 50px;
    }
    .tlops-more-content{
        padding: 20px;
        text-align: center;
        word-break: break-all;
        background: #f6fbff;
        border-radius: 15px;
        margin-top: 10px;
    }
    .tlops-more-content-rule{
        line-height: 24px;
        font-weight: 700;
    }
    .tlops-more-content-header{
        text-align: center;
        font-size: 16px;
        font-weight: 800;
        color: #c1b420;
        margin-top: 20px;
    }
</style>

<body class="layui-layout-body">

    <a href="https://tlops.iamtsm.cn/website/index.html"><img src="https://qnproxy.iamtsm.cn/logo.png" alt="logo" class="tlops-logo"></a>

    <ul class="layui-nav">
        <li class="layui-nav-item"><a href="https://book.iamtsm.cn" target="_blank">文档</a></li>
        <li class="layui-nav-item"><a href="https://tlops.iamtsm.cn/tlopsmanage/tl_ops_web_index.html" target="_blank">体验</a></li>
        <li class="layui-nav-item"><a href="https://github.com/iamtsm/tl-ops-manage/blob/main/doc/change.md" target="_blank">更新日志</a></li>
        <li class="layui-nav-item"><a href="https://tlops.iamtsm.cn/website/plugins.html" target="_blank">插件列表</a></li>
        <li class="layui-nav-item">
            <a href="https://github.com/iamtsm/tl-ops-manage" style="margin-left: 20px;" target="_blank">
                <svg class="tlops-github-logo" viewBox="0 0 1024 1024" p-id="1341" width="128" height="128">
                    <path d="M512 42.666667A464.64 464.64 0 0 0 42.666667 502.186667 460.373333 460.373333 0 0 0 363.52 938.666667c23.466667 4.266667 32-9.813333 32-22.186667v-78.08c-130.56 27.733333-158.293333-61.44-158.293333-61.44a122.026667 122.026667 0 0 0-52.053334-67.413333c-42.666667-28.16 3.413333-27.733333 3.413334-27.733334a98.56 98.56 0 0 1 71.68 47.36 101.12 101.12 0 0 0 136.533333 37.973334 99.413333 99.413333 0 0 1 29.866667-61.44c-104.106667-11.52-213.333333-50.773333-213.333334-226.986667a177.066667 177.066667 0 0 1 47.36-124.16 161.28 161.28 0 0 1 4.693334-121.173333s39.68-12.373333 128 46.933333a455.68 455.68 0 0 1 234.666666 0c89.6-59.306667 128-46.933333 128-46.933333a161.28 161.28 0 0 1 4.693334 121.173333A177.066667 177.066667 0 0 1 810.666667 477.866667c0 176.64-110.08 215.466667-213.333334 226.986666a106.666667 106.666667 0 0 1 32 85.333334v125.866666c0 14.933333 8.533333 26.88 32 22.186667A460.8 460.8 0 0 0 981.333333 502.186667 464.64 464.64 0 0 0 512 42.666667" fill="#ffffff" p-id="1342"></path>
                </svg>
                <span>Github</span>
            </a>
        </li>
        <li class="layui-nav-item"><a href="https://tlops.iamtsm.cn/website/en.html">EN</a></li>
    </ul>

    <div class="tlops-intro-content">
        <div class="tlops-intro-main">
            基于openresty的API网关
        </div>
        <div class="tlops-intro-tag">
            <span class="layui-badge layui-bg-blue">负载均衡</span>
            <span class="layui-badge layui-bg-green">健康检查</span>
            <span class="layui-badge layui-bg-orange">服务熔断</span>
            <span class="layui-badge layui-bg-cyan">服务限流</span>
            <span class="layui-badge layui-bg-black">黑白名单</span>
            <span class="layui-badge layui-bg-blue">WAF过滤</span>
            <span class="layui-badge layui-bg-gray">动态证书</span>
            <span class="layui-badge layui-bg-orange">多级缓存</span>
            <span class="layui-badge layui-bg-cyan">管理界面</span>
            <span class="layui-badge layui-bg-gray">动态配置</span>
            <span class="layui-badge layui-bg-blue">数据统计</span>
            <span class="layui-badge layui-bg-blue">集群部署</span>
            <span class="layui-badge layui-bg-black">自定义插件</span>
            <span class="layui-badge layui-bg-orange">...</span>
        </div>
    </div>

    <div class="tlops-feat-content">
        <div class="layui-panel">
            <div class="layui-card">
                <div class="layui-card-header">负载均衡</div>
                <div class="layui-card-body">
                    支持多模式路由，支持自定义参数，自定义请求头，自定义cookie，自定义url 等路由策略，路由重写，自定义错误码和内容模板
                </div>
                <div class="tlops-more-content-header"> 常用场景 </div>
                <div class="tlops-more-content">
                    <div class="tlops-more-content-rule">提供外部API，内部分流场景</div>
                    <div class="tlops-more-content-rule">灰度测试需要将部分流量引入灰度机器场景</div>
                    <div class="tlops-more-content-rule">需要自定义流量分发失败错误内容场景</div>
                </div>
            </div>
        </div>
        <div class="layui-panel">
            <div class="layui-card">
                <div class="layui-card-header">WAF过滤</div>
                <div class="layui-card-body">
                    支持多层级WAF过滤，支持自定义参数过滤，自定义请求头过滤，自定义cookie过滤，自定义url过滤，CC过滤 等WAF策略，自定义错误码和内容模板
                </div>
                <div class="tlops-more-content-header"> 常用场景 </div>
                <div class="tlops-more-content">
                    <div class="tlops-more-content-rule">网关层流量清洗，过滤垃圾流量场景</div>
                    <div class="tlops-more-content-rule">防CC攻击，防Sql注入等场景</div>
                    <div class="tlops-more-content-rule">拦截机器人，脚本等恶意请求场景</div>
                    <div class="tlops-more-content-rule">需要自定义拦截成功返回内容，如拦截输入验证码场景</div>
                </div>
            </div>
        </div>
        <div class="layui-panel">
            <div class="layui-card">
                <div class="layui-card-header">熔断限流</div>
                <div class="layui-card-body">
                    支持多种限流器，支持限流器动态切换，支持自动化熔断恢复，支持自动熔断限流数据统计展示
                </div>
                <div class="tlops-more-content-header"> 常用场景 </div>
                <div class="tlops-more-content">
                    <div class="tlops-more-content-rule">应用层节点服务不可用，能自动降级场景</div>
                    <div class="tlops-more-content-rule">请求过高，需动态限制访问量场景</div>
                </div>
            </div>
        </div>
        <div class="layui-panel">
            <div class="layui-card">
                <div class="layui-card-header">自定义插件</div>
                <div class="layui-card-body">
                    支持自定义插件，默认提供多种插件，如动态证书，数据同步预热,  插件市场不断扩展中..
                </div>
                <div class="tlops-more-content-header"> 常用场景 </div>
                <div class="tlops-more-content">
                    <div class="tlops-more-content-rule">需要二次开发贴合业务需求的场景</div>
                </div>
            </div>
        </div>
        <div class="layui-panel">
            <div class="layui-card">
                <div class="layui-card-header">集群数据同步</div>
                <div class="layui-card-body">
                    支持多节点主从模式部署，提高可用性
                </div>
                <div class="tlops-more-content-header"> 常用场景 </div>
                <div class="tlops-more-content">
                    <div class="tlops-more-content-rule">需要多节点部署高可用环境的场景</div>
                </div>
            </div>
        </div>
        <div class="layui-panel">
            <div class="layui-card">
                <div class="layui-card-header">管理界面</div>
                <div class="layui-card-body">
                    支持可视化操作界面，支持动态统计数据实时展示，支持动态配置更新
                </div>
            </div>
        </div>
        <div class="layui-panel">
            <div class="layui-card">
                <div class="layui-card-header">更多功能</div>
                <div class="layui-card-body">
                    如多级缓存，日志分析，配置管理，自动部署脚本等，功能不断迭代更新中...
                </div>
            </div>
        </div>
    </div>

    <div class="tlops-quick-start">
        <div style="text-align: center; color: white; font-size: 24px;margin-top: 10px">快速开始</div>
        <div class="tlops-feat-content-all">
            <div class="tlops-feat-content-comment">## 1. 下载项目</div>
            <div class="tlops-feat-content-data">$ git clone https://github.com/iamtsm/tl-ops-manage</div>
            <div class="tlops-feat-content-comment">## 或者直接下载对应包文件</div>
            <div class="tlops-feat-content-data">$ https://github.com/iamtsm/tl-ops-manage/releases</div>

            <div class="tlops-quick-start-line"></div>

            <div class="tlops-feat-content-comment">## 2. 安装openresty</div>
            <div class="tlops-feat-content-data">$ https://openresty.org/download/openresty-1.19.3.1.tar.gz</div>

            <div class="tlops-quick-start-line"></div>

            <div class="tlops-feat-content-comment">## 3. 修改配置</div>

            <div class="tlops-feat-content-comment">## tl-ops-manage/conf/tl_ops_manage.conf</div>
            <div class="tlops-feat-content-data">ssl_certificate <b style="color: #db5959">/path/to</b>/tl-ops-manage/conf/tlops.com.pem;</div>
            <div class="tlops-feat-content-data">ssl_certificate_key <b style="color: #db5959">/path/to</b>/tl-ops-manage/conf/tlops.com.key;</div>

            <div class="tlops-feat-content-comment">## openresty/conf/nginx.conf</div>
            <div class="tlops-feat-content-data"> http {</div>
            <div class="tlops-feat-content-data" style="text-indent: 30px">...</div>
            <div class="tlops-feat-content-data" style="text-indent: 30px">include "<b style="color: #db5959">/path/to</b>/tl-ops-manage/conf/*.conf; # 引入tl_ops_manage.conf</div>
            <div class="tlops-feat-content-data" style="text-indent: 30px"> </div>
            <div class="tlops-feat-content-data" style="text-indent: 30px">lua_package_path "<b style="color: #db5959">/path/to</b>/tl-ops-manage/?.lua;;" # 引入lua包</div>
            <div class="tlops-feat-content-data" style="text-indent: 30px">...</div>
            <div class="tlops-feat-content-data">}</div>

            <div class="tlops-feat-content-comment"> ## tl-ops-manage/tl_ops_manage_env.lua </div>
            <div class="tlops-feat-content-comment">  # 项目路径 </div>
            <div class="tlops-feat-content-data"> ROOT_PATH = "<b style="color: #db5959">/path/to</b>/tl-ops-manage/",</div>

            <div class="tlops-quick-start-line"></div>

            <div class="tlops-feat-content-comment">## 4. 启动nginx/openresty</div>
            <div class="tlops-feat-content-comment"># 管理后台 </div>
            <div class="tlops-feat-content-data">http://<b style="color: #db5959">yourdomain</b>//tlopsmanage/tl_ops_web_index.html</div>
        </div>
    </div>

    <div class="tlops-foot-content">
        <a href="https://github.com/iamtsm" target="_blank">Copyright @ 2021 iamtsm</a>
    </div>

</body>

</html>